<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../js/vue.js"></script>
</head>
<body>
    <div id="app">
        <h2>{{msg}}</h2>
        <h4>v-model="msg" </h4>
        <input type="text" v-on:keydown.enter="keydown" v-on:keydown.delete="del" v-on:keydown="key"></input>

        <div style="background-color: pink;height: 100px;width: 100px;display: block;" v-on:click.ctrl="biu">我知道</div>
    </div>
</body>
<script>
    var vm=new Vue({
        el:"#app",
        data:{
            msg:"输入字符KeyCode"
        },
        methods: {
            keydown:function(e){
                console.log(e.keyCode)
                if(e.keyCode==13){
                    this.msg=e.target.value;
                    e.target.value="";
                }
            },
            del:function(e){
                console.log(e.keyCode)
                this.msg="";
                e.target.value="";
            },key:function(e){
                // console.log(e.keyCode)
                console.log(`msg:${this.msg}+${e.target.value}`)
            },biu:function(){
                alert("这是组合键");
            }

        },
    })
</script>
</html>